extends ../layout

block vars
	- var suppressNavbar = true
	- var suppressFooter = true
	- var suppressSkipToContent = true
	- metadata.robotsNoindexNofollow = true

block css
	each file in entrypointStyles('ide')
		link(rel='stylesheet', href=file)

block content
	.editor(ng-controller="IdeController").full-size
		//- required by react2angular-shared-context, must be rendered as a top level component
		shared-context-react()
		.loading-screen(ng-if="state.loading")
			.loading-screen-brand-container
				.loading-screen-brand(
					style="height: 20%;"
					ng-style="{ 'height': state.load_progress + '%' }"
				)
			h3.loading-screen-label(ng-if="!state.error") #{translate("loading")}
				span.loading-screen-ellip .
				span.loading-screen-ellip .
				span.loading-screen-ellip .
			p.loading-screen-error(ng-if="state.error").ng-cloak
				span(ng-bind-html="state.error")

		.global-alerts(ng-cloak ng-hide="editor.error_state")
			.alert.alert-danger.small(ng-if="connection.forced_disconnect")
				strong #{translate("disconnected")}

			.alert.alert-warning.small(ng-if="connection.reconnection_countdown")
				strong #{translate("lost_connection")}.
				|  #{translate("reconnecting_in_x_secs", {seconds:"{{ connection.reconnection_countdown }}"})}.
				a#try-reconnect-now-button.alert-link-as-btn.pull-right(href, ng-click="tryReconnectNow()") #{translate("try_now")}

			.alert.alert-warning.small(ng-if="connection.reconnecting && connection.stillReconnecting")
				strong #{translate("reconnecting")}…

			.alert.alert-warning.small(ng-if="sync_tex_error")
				strong #{translate("synctex_failed")}.
				a#synctex-more-info-button.alert-link-as-btn.pull-right(
					href="/learn/how-to/SyncTeX_Errors"
					target="_blank"
				) #{translate("more_info")}

			.alert.alert-warning.small(ng-if="connection.inactive_disconnect")
				strong #{translate("editor_disconected_click_to_reconnect")}

			.alert.alert-warning.small(ng-if="connection.debug") {{ connection.state }}

			.div(ng-controller="SavingNotificationController")
				.alert.alert-warning.small(ng-repeat="(doc_id, state) in docSavingStatus" ng-if="state.unsavedSeconds > 8") #{translate("saving_notification_with_seconds", {docname:"{{ state.doc.name }}", seconds:"{{ state.unsavedSeconds }}"})}

			.div(ng-controller="SystemMessagesController")
				.alert.alert-warning.system-message(
					ng-repeat="message in messages"
					ng-controller="SystemMessageController"
					ng-hide="hidden"
				)
					button(ng-hide="protected",ng-click="hide()").close.pull-right
						span(aria-hidden="true") &times;
						span.sr-only #{translate("close")}
					.system-message-content(ng-bind-html="htmlContent")

		if detachRole === 'detached'
			div.full-size
				if showNewPdfPreview
					pdf-preview()
				else
					include ./editor/pdf
		else
			include ./editor/main

	script(type="text/ng-template", id="genericMessageModalTemplate")
		.modal-header
			button.close(
				type="button"
				data-dismiss="modal"
				ng-click="done()"
				aria-label="Close"
			)
				span(aria-hidden="true") &times;
			h3 {{ title }}
		.modal-body(ng-bind-html="message")
		.modal-footer
			button.btn.btn-info(ng-click="done()") #{translate("ok")}

	script(type="text/ng-template", id="outOfSyncModalTemplate")
		.modal-header
			button.close(
				type="button"
				data-dismiss="modal"
				ng-click="done()"
				aria-label="Close"
			)
				span(aria-hidden="true") &times;
			h3 {{ title }}
		.modal-body(ng-bind-html="message")

		.modal-body
			button.btn.btn-info(
				ng-init="showFileContents = false"
				ng-click="showFileContents = !showFileContents"
			)
				| {{showFileContents ? "Hide" : "Show"}} Local File Contents
			.text-preview(ng-show="showFileContents")
				textarea.scroll-container(readonly="readonly" rows="{{editorContentRows}}")
					| {{editorContent}}

		.modal-footer
			button.btn.btn-info(ng-click="done()") #{translate("reload_editor")}

	script(type="text/ng-template", id="lockEditorModalTemplate")
		.modal-header
			h3 {{ title }}
		.modal-body(ng-bind-html="message")

block append meta
	meta(name="ol-useV2History" data-type="boolean" content=useV2History)
	meta(name="ol-project_id" content=project_id)
	meta(name="ol-userSettings" data-type="json" content=userSettings)
	meta(name="ol-user" data-type="json" content=user)
	meta(name="ol-anonymous" data-type="boolean" content=anonymous)
	meta(name="ol-brandVariation" data-type="json" content=brandVariation)
	meta(name="ol-anonymousAccessToken" content=anonymousAccessToken)
	meta(name="ol-isTokenMember" data-type="boolean" content=isTokenMember)
	meta(name="ol-isRestrictedTokenMember" data-type="boolean" content=isRestrictedTokenMember)
	meta(name="ol-maxDocLength" data-type="json" content=maxDocLength)
	meta(name="ol-wikiEnabled" data-type="boolean" content=!!(settings.apis.wiki && settings.apis.wiki.url))
	meta(name="ol-gitBridgePublicBaseUrl" content=gitBridgePublicBaseUrl)
	//- Set base path for Ace scripts loaded on demand/workers and don't use cdn
	meta(name="ol-aceBasePath" content="/js/" + lib('ace'))
	//- Set path for PDFjs CMaps and images
	meta(name="ol-pdfCMapsPath" content="/js/cmaps/")
	meta(name="ol-pdfImageResourcesPath" content="/images/")
	//- enable doc hash checking for all projects
	//- used in public/js/libs/sharejs.js
	meta(name="ol-useShareJsHash" data-type="boolean" content=true)
	meta(name="ol-wsRetryHandshake" data-type="json" content=settings.wsRetryHandshake)
	meta(name="ol-showNewLogsUI" data-type="boolean" content=showNewLogsUI)
	meta(name="ol-logsUISubvariant" content=logsUISubvariant)
	meta(name="ol-showPdfDetach" data-type="boolean" content=showPdfDetach)
	meta(name="ol-debugPdfDetach" data-type="boolean" content=debugPdfDetach)
	meta(name="ol-showNewPdfPreview" data-type="boolean" content=showNewPdfPreview)
	meta(name="ol-enablePdfCaching" data-type="boolean" content=enablePdfCaching)
	meta(name="ol-trackPdfDownload" data-type="boolean" content=trackPdfDownload)
	meta(name="ol-resetServiceWorker" data-type="boolean" content=resetServiceWorker)
	meta(name="ol-detachRole" data-type="string" content=detachRole)

	- var fileActionI18n = ['edited', 'renamed', 'created', 'deleted'].reduce((acc, i) => {acc[i] = translate('file_action_' + i); return acc}, {})
	meta(name="ol-fileActionI18n" data-type="json" content=fileActionI18n)

	if (settings.overleaf != null)
		meta(name="ol-overallThemes" data-type="json" content=overallThemes)

block foot-scripts
	script(type="text/javascript", nonce=scriptNonce, src=(wsUrl || '/socket.io') + '/socket.io.js')
	script(type="text/javascript", nonce=scriptNonce, src=mathJaxPath)
	each file in entrypointScripts("ide")
		script(type="text/javascript", nonce=scriptNonce, src=file)
